import { appLocalStorage } from 'magic-ui-react';
import { useEffect } from 'react';
import {
  useRoutes,
  useNavigate
} from 'react-router-dom'
import { routes } from './routes';
import { getUserInfoAsync } from './store/userSlice';
import { loginStatus } from './utils/tools';
import { useAppDispatch } from './utils/tools/store';

function App() {
  const elements = useRoutes(routes);
  const navigate = useNavigate()
  const dispatch = useAppDispatch();
  const appInit = () => {
    if (!loginStatus()) {
      navigate('/login')
    } else {
      dispatch(getUserInfoAsync())
    }
    let theme = appLocalStorage.getValue('theme')
    if (!theme) {
      appLocalStorage.setValue('theme', 'light')
    } else {
      document.querySelector('body')?.setAttribute('theme', theme)
    }
  }


  useEffect(() => {
    appInit()
  }, [])
  return elements
}

export default App
